<template>
	<div id="">
		<el-form :inline="true" size="medium">
			<el-form-item>
				<el-select v-model="params.status" placeholder="状态" clearable @change="search">
					<el-option value="0" label="处理中"></el-option>
					<el-option value="1" label="已处理"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item>
				<el-input placeholder="商家ID" v-model="params.bus_id" clearable></el-input>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="search">搜索</el-button>
			</el-form-item>
		</el-form>

		<el-table :data="list" v-loading="loading" stripe>
			<el-table-column label="商家ID" prop="bus_id" align="center"></el-table-column>
			<el-table-column label="图片" align="center">
				<template slot-scope="scope">
					<el-image fit="cover" :src="scope.row.img | fullPath" :preview-src-list="[$envConfig.serviceUrl + scope.row.img]" style="width:100px; height:100px">
                    </el-image>
				</template>
			</el-table-column>
			<el-table-column label="快递单号" prop="express_nos" align="center"></el-table-column>
			<el-table-column label="问题描述" prop="issue" align="center"></el-table-column>
			<el-table-column label="状态" align="center">
				<template slot-scope="scope">
					<span v-if="scope.row.status == 0">处理中</span>
					<span v-else>已处理</span>
				</template>
			</el-table-column>
			<el-table-column label="平台回复" prop="remark" align="center"></el-table-column>
			<el-table-column label="提交时间" align="center">
				<template slot-scope="scope">
					{{$common.getDate(scope.row.create_time)}}
				</template>
			</el-table-column>
			<el-table-column label="操作" align="center">
				<template slot-scope="scope">
					<el-button v-if="scope.row.status == 0" size="small" type="primary" @click="updateStatus(scope.row.id)">处理</el-button>
				</template>
			</el-table-column>
		</el-table>

		<el-pagination 
			class="page"
			background
			@size-change="handleSizeChange" 
			@current-change="getList" 
			:current-page.sync="params.pageNo" 
			:page-sizes="[10, 20, 50, 100]" 
			:page-size="params.pageSize" 
			layout="total, sizes, prev, pager, next, jumper" 
			:total="total">
		</el-pagination>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				params: {
					busId: '',
					status: '0',
					endTime: '',
					startTime: '',
					pageNo: 1,
					pageSize: 10,
					isCount: true,
					tenantid:sessionStorage.getItem("tenantid")
				},
				list: [],
				total: 0,
				loading: false,
				selectData: [],
				timeArr: [],
			};
		},

		watch: {},

		created() {
			this.getList();
		},

		mounted() {
			
		},

		methods: {
			timeChange(val){
				if(val){
					this.params.startTime = this.$common.getDate(val[0]);
					this.params.endTime = this.$common.getDate(val[1]);
				}else{
					this.params.startTime = ''
					this.params.endTime = ''
				}
			},
			updateStatus(id){
				this.$prompt('请输入回复内容', '处理', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				inputPattern: /^[\s\S]*.*[^\s][\s\S]*$/,
				inputErrorMessage: '回复内容不能为空'
				}).then(({ value }) => {
					const loading = this.$loading({
						lock: true,
						text: 'Loading',
						spinner: 'el-icon-loading',
						background: 'rgba(0, 0, 0, 0.7)'
					});
					this.$request.post({
						url:'/ReportApi/tenant/userupdateStatus',
						params:{
							id,
							remark:value,
						},
						success: res => {
							this.$message.success('操作成功')
							this.getList()
						},
						finally: res => {
							loading.close()
						}
					})
				}).catch(() => {
				});
				
			},
			handleSizeChange(value) {
				this.params.pageSize = value 
				this.search()
			},
			
			search(){
				this.params.pageNo = 1
				this.params.isCount = true 
				this.getList();
			},
			
			getList() {
				this.loading = true
				this.$request.post({
					url: '/ReportApi/tenant/useraftersalelist',
					params: this.params,
					success: result =>{
						this.list = result[0] 
						if(this.params.isCount){
							this.params.isCount = false 
							this.total = result[1]
						}
					},
					finally: ()=>{
						this.loading = false 
					}
				})
			}
		},

		beforeDestroy() {}
	}
</script>

<style>

</style>

<style lang="scss" scoped>
	.page{
		text-align: right;
		margin-top: 20px;
	}
</style>
